<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <META HTTP-EQUIV="pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-store, must-revalidate">
    <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
    <META HTTP-EQUIV="expires" CONTENT="0">
    <title>新增产品</title>
    <link rel="stylesheet" type="text/css" href="./css/main.css" />
    <link rel="stylesheet" type="text/css" href="./layui/css/layui.css" />
    <link rel="stylesheet" type="text/css" href="./css/layuiAdminTheme.css" />
    <link rel="stylesheet" href="layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="css/public.css" media="all" />

    <style type="text/css">
    </style>
</head>
<body>

<script src="./js/main.js" charset="utf-8"></script>
<!--    <script src="https://cdn.jsdelivr.net/npm/jquery" charset="utf-8"></script>-->
<script src="./layui/layui.js" charset="utf-8"></script>
<script src="./js/jQuery.main.js"></script>
<script src="./js/xm-select.js" type="text/javascript" charset="utf-8"></script>

<form class="layui-form" action="" lay-filter="data">
    <div class="layui-form-item">
        <div class="layui-row" style="width: 45em">
            <div class="layui-col-md8"><label class="layui-form-label" style="width: 7em;">产品名/PN：</label>
                <input type="text" name="pinName" lay-verify="required" autocomplete="" class="layui-input" style="width: 18em;"
                       placeholder="请输入产品名"></div>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-block">
            <label class="layui-form-label" style="width: 7em;">产品类型：</label>
            <div class="layui-input-inline " style="width: 18em">
                <select name="productType" id="productType" lay-verify="required" lay-filter="productType">
                    <option value="主产品">主产品</option>
                    <option value="半成品">半成品</option>
                </select></div>
            <!--          <input type="text" name="productType" lay-verify="required" autocomplete="" class="layui-input" style="width: 18em;"-->
            <!--            placeholder="请输入产品类型">-->
        </div>
    </div>

    <div class="layui-form-item" >
        <label class="layui-form-label" style="width: 7em;">部门：</label>
        <div class="layui-input-inline " style="width: 15em">
            <select name="deptName" id="deptName" lay-verify="required" lay-filter="deptName">
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-block" style="width: 7em;"><label class="layui-form-label">选择工序：</label></div>
        <div class="layui-input-inline" style="width: 7em;"><div id="process" lay-filter="process" style="width: 45em;" ></div></div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label"></label>
        <button id="save" type="button" class="layui-btn layui-btn-normal" lay-submit="" lay-filter="save"><b>确认新增</b></button>
    </div>
</form>

<script type="text/javascript" src="./layui/layui.js"></script>
<script type="text/javascript">
    var form = null;
    let isAd=null;
    let thisDept=null;
    var list = [];


    layui.use(['form',"layer"], function() {
        form = layui.form;
        $.ajax({
            url: url + '/sys-dept/listDept',
            method: 'POST',
            async : false,
            contentType: 'application/json',
            success: function(res) {
                //显示前先判断是否为管理员
                $.ajax({
                    url: '/sys-user/getAdmin/'+sessionStorage.getItem('userId'),
                    method: 'GET',
                    async : false,
                    contentType: 'application/json',
                    success: function (res) {
                        if (res.code===200){
                            isAd=1;
                        }
                        else if (res.code===400){
                            isAd=0;
                            thisDept=res.data.dept;
                        }
                    }
                })
                //按照是否为管理员显示下拉框
                if (res.code == 200) {
                    for (var i = 0; i < res.data.length; i++) {
                        if(isAd===1){
                            $("#deptName").append("<option value='" + res.data[i].id + "'>" + res.data[i].dept +"</option>");
                        }else if (isAd===0&&res.data[i].dept===thisDept){
                            $("#deptName").append("<option selected='selected' value='" + res.data[i].id + "'>" + res.data[i].dept +"</option>").attr('disabled','disabled');
                        }
                    }
                    form.render('select');
                }
            }
        })
        //提交
        form.on('submit(save)', function () {
            $.ajax({
                url: '/sys-user/getAdminLevel/'+sessionStorage.getItem('userId'),
                method: 'GET',
                contentType: 'application/json',
                success: function (res) {
                    if (res.code === 200) {
                        var data = form.val('data');
                        data.createBy=sessionStorage.getItem('loginName');
                        data.productType=$('#productType').val();
                        data.deptId=$('#deptName').val();
                        let confirm1 = layer.confirm('确定新增产品吗？', {
                            btn: ['确定', '取消']
                        }, function () {
                            $.ajax({
                                url: url + '/pin-library/save',
                                method: 'POST',
                                contentType: 'application/json',
                                data: JSON.stringify(data),
                                success: function (res) {
                                    if (res.code == 200){
                                        parent.layer.alert(res.msg, {
                                            icon: 1,
                                            skin: 'layer-ext-demo' //见：扩展说明
                                        });
                                        parent.switchNav(0);
                                    } else{
                                        parent.layer.alert(res.msg, {
                                            icon: 2,
                                            skin: 'layer-ext-demo' //见：扩展说明
                                        });
                                    }
                                }
                            })
                            layer.close(confirm1);
                        }, function () {
                            layer.close(confirm1);
                        })
                    }else{
                        layer.msg("权限不足");
                    }
                }
            })
        });

        //下拉框二级联动
        form.on('select(deptName)', function(data) {
            //工序下拉框联动
            var processOptions = {
                el: '#process',
                name: 'process',//表单的name属性
                filterable: true,
                id: 'myProcess',
                layVerify: 'required',//必填项
                //layVerType: 'tips',//提示类型 同layui
                tips: '请选择工序...',
                toolbar: {//工具条,全选,清空,反选,自定义
                    show: true,
                    list: [
                        'ALL',
                        'CLEAR',
                        'REVERSE',
                        {
                            name: '(★)',
                            icon: 'el-icon-star-off',
                        }
                    ]
                },
                data: [],
            };

            var process = xmSelect.render(processOptions)

            setTimeout(function(){
                $.ajax({
                    url: url + '/process-info/listProcess',
                    method: 'POST',
                    async : false,
                    contentType: 'application/json',
                    data: JSON.stringify({
                        userId: sessionStorage.getItem('userId'),
                        deptId: $('#deptName').val()
                    }),
                    success: function(res) {
                        //data是ajax 异步获取的
                        var data =[];
                        for (var i = 0; i < res.data.length; i++) {
                            data.push({
                                name : res.data[i].processName,
                                value :res.data[i].id
                            });
                        }
                        //模拟通过ajax 获取json数据,异步更新多选下拉框的值
                        process.update({data: data})
                    }
                })
            },100);
            form=layui.form;
            form.render('select');
        })
    });


    //默认工序下拉框
    var processOptions = {
        el: '#process',
        name: 'process',//表单的name属性
        id: 'myProcess',
        layVerify: 'required',//必填项
        filterable: true,
        //remoteSearch: true, //自定义搜索
        //layVerType: 'tips',//提示类型 同layui
        tips: '请选择工序...',
        toolbar: {//工具条,全选,清空,反选,自定义
            show: true,
            list: [
                'ALL',
                'CLEAR',
                'REVERSE',
                {
                    name: '(★请按顺序选取)',
                    icon: 'el-icon-star-off',
                }
            ]
        },
        data: [],
    };

    var process = xmSelect.render(processOptions)

    setTimeout(function(){
        $.ajax({
            url: url + '/process-info/listProcess',
            method: 'POST',
            contentType: 'application/json',
            data: JSON.stringify({
                userId: sessionStorage.getItem('userId'),
                deptId: $('#deptName').val()
            }),
            success: function(res) {
                //data是ajax 异步获取的
                var data =[];
                for (var i = 0; i < res.data.length; i++) {
                    data.push({
                        name : res.data[i].processName,
                        value :res.data[i].id
                    });
                }
                //模拟通过ajax 获取json数据,异步更新多选下拉框的值
                process.update({data: data})
            }
        })
    },100);
</script>
</body>

</html>
